<template>
    <StudentForm :student="student" @submit="handleSubmit" />
</template>

<script setup>
import StudentForm from '../components/StudentForm.vue'
import { ref,onMounted} from 'vue'
import { useRoute,useRouter} from 'vue-router'
import { useMemberStore } from '../stores/member';

const memberStore = useMemberStore()
const route = useRoute()
const router = useRouter()

const student = ref({
    id: null,
    grades:{
        frontend:null,
        english:null,
        oython:null
    }
})

onMounted(() => {
    const stu =memberStore.getUserById(Number(route.params.id))
    if(stu){
        student.value.id = stu.id
        student.value.grades = {...stu.grades}
    }
})

const handleSubmit = () =>{
    memberStore.updateStudentGrades(student.value.id,student.value.grades)
    router.push('/students')
}
</script>